<div class="cont">
	<div class="title">账单明细 [{$month}]</div>
	<div class="title tbg">固定费用<span class="fr">金额</span></div>
	<ul>
	    <li>房租<span class="fr">{$costlist[1]['rent']}元</span></li>
	    <li>物业费<span class="fr">{$costlist[1]['property']}元</span></li>
	    <?php if(!empty($costlist[1]['begin_time'])){ ?>
	    <li>开始时间<span class="fr">{$costlist[1]['begin_time']|date='Y-m-d', ###}</span></li>
	    <li>结束时间<span class="fr">{$costlist[1]['end_time']|date='Y-m-d', ###}</span></li>
	    <?php }?>
	</ul>
	<div class="title tbg">日常费用<span class="fr">金额</span></div>
	<ul>
	    <li>电费<span class="fr">{$costlist[2]['rates2']}元</span></li>
	    <li>水费<span class="fr">{$costlist[2]['rates1']}元</span></li>
	</ul>
</div>
<div id="tabkuang" style="display:none;">
	<div id="paymethod">
		<img src="__PUBLIC__/h-ui/wap/images/weixin2.png" _val="weixin" style="width:30px; float:left; margin-top:5px; margin-left:35px" onclick="xuanze(this);" />
		<img src="__PUBLIC__/h-ui/wap/images/alipay2.png" _val="alipay" style="width:30px; float:left; margin:5px 15px 0px 50px;" onclick="xuanze(this);" />
	</div>
</div>
<div class="btns" style="padding-bottom: 20px;">
    <?php if($status){ ?>
    <a href="javascript:void(0);" style="background: #b7bcbf;">已缴费</a>
    <?php }else{ ?>
    <a href="javascript:void(0);" class="goto">去缴费</a>
    <?php } ?>
    <!--
    <a href="javascript:void(0);">订单查询</a>-->
</div>
<script type="text/javascript">
	var pay = '';
	
	function xuanze(obj){
		var obj = $(obj);
		//设置方式
		pay = obj.attr('_val');
		//切换图片
		$("#paymethod img").each(function(){
			var imgs = $(this).attr('src');
			//替换
			imgs = imgs.replace('1.png', '2.png');
			$(this).attr('src', imgs);	
		});
		
		var imgs = obj.attr('src');
			imgs = imgs.replace('2.png', '1.png');
		obj.attr('src', imgs);
	};
	
	//判断浏览器是否为微信浏览器
	function isWeiXin(){ 
		var ua = window.navigator.userAgent.toLowerCase(); 
		if(ua.match(/MicroMessenger/i) == 'micromessenger'){ 
			return true; 
		}else{ 
			return false; 
		} 
	}

	$(document).ready(function(){
		function onclickBtn(){
			$(this).find('input').attr('checked', true);
		}
		
		$(".goto").on('click', function(){
			var html = $("#tabkuang").html();
			var index = layer.open({
				title: '请选择支付方式',
			    content: html,
			    yes: function(){
			    	layer.close(index);
			    	//异步请求支付请求
			    	var month = '{$month}'; //月份
			    	var roomnumber = '{$roomnumber}';
			    	if(pay == ''){
						layer.msg('请选择支付方式', {icon: 5,time:2000});
						return false;
					}else{
						$.post('costorder.html', {
							'month': month,
							'roomnumber': roomnumber,
							'contract': "{$contract}",
							'pay': pay
						}, function(rs){
							if(rs.errCode/1){
								if(pay == 'weixin'){
									if(isWeiXin()){
										window.location.href = "http://mamagy.com/xj/wap/weixinpay.html?rn="+ roomnumber + "&oid="+ rs.orderid;
									}else{
										layer.msg('请在微信浏览器中打开', {icon: 5, time: 3000});
									}
								}else if(pay == 'alipay'){
									//判断浏览器是否为微信浏览器
									if(isWeiXin()){
										layer.msg('请在右上角选择——外部浏览器中打开', {icon: 5, time: 3000});
									}else{
										window.location.href = "http://mamagy.com/xj/wap/alipay.html?rn="+ roomnumber + "&oid="+ rs.orderid;
									}
								}
							}else{
								layer.msg(rs.errMsg, {icon: 5, time: 2000});
							}
						}, "JSON");
					}
			    }
			});
		});
	});
</script>